<template>
<!-- 我的社团中心 -->
    <div style="width:100%;height:100%;overflow-x:hidden;overflow-y:auto;background-color:#F8F8FF" >
        <div style="width:100%;" v-if="tableDate==null">
            <el-empty description="你还未加入任何社团"></el-empty>
        </div>
        <div style="width:100%" v-if="tableDate!=null">
            <div style="width:100%;"  v-for="i in tableDate" :key="i.id" >
                <div class="panel panel-default" style="width:93%;margin:0 auto;margin-top:20px">
                    <div class="panel-heading" style="text-align:center;font-size:20px;font-weight:bold"><span>{{i.assInformation.assName}}</span></div>
                    <div class="panel-body" style="height:350px;width:100%">
                        <el-row style="width:100%;height:100%">
                            <el-col :span="8" style="height:100%;">
                                <div class="grid-content bg-purple" style="height:100%">
                                    <el-image :src="imageUrl+i.assInformation.assImages" style="width:100%;height:100%"></el-image>
                                </div>
                            </el-col>
                            <el-col :span="8"><div class="grid-content bg-purple-light"></div></el-col>
                            <el-col :span="8"><div class="grid-content bg-purple"></div></el-col>
                        </el-row>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    data(){
        return{
            imageUrl:"http://localhost:8081/images/",
            tableDate:null 
        }
    },
    created(){
        this.queryUserCommunity();
    },
    methods:{
         // 查询用户所在的社团;
        queryUserCommunity(){
            
            var uId=this.$cookies.get('userLogin');
            this.$axios.get("http://localhost:8081/user/queryAllAss",{
                params:{
                    stuId: uId
                } 
            }).then(res=>{ 
                this.tableDate= res.data.data;
                console.log(res.data.data);
            })
        },
    }
}
</script>